import { useEffect, useState } from 'react'
import { AnimationAction, AnimationMixer } from 'three'

const useAnimationControl = (
  actions: Record<string, AnimationAction | undefined>,
  mixer?: AnimationMixer
) => {
  const [selectedAction, setSelectedAction] = useState('')
  const [currentAction, setCurrentAction] = useState<AnimationAction | null>(null)

  useEffect(() => {
    if (!selectedAction || !actions[selectedAction]) return

    const newAction = actions[selectedAction]
    if (!newAction) return

    newAction.reset().fadeIn(0.5).play()
    currentAction?.fadeOut(0.5)
    setCurrentAction(newAction)

    return () => {
      newAction?.fadeOut(0.5)
    }
  }, [selectedAction])

  return {
    selectedAction,
    handleActionChange: setSelectedAction
  }
}

export default useAnimationControl
